import { IFormApi } from '@/components/form/BmForm'
import { BmInput } from '@/components/form/BmInput'
import { BmRadioGroup } from '@/components/form/BmRadioGroup'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { FC } from 'react'

export const Pay: FC<{ form: IFormApi<Record<string, any>> }> = ({ form }) => {
  return (
    <main className="grid grid-cols-2 gap-3">
      <Card>
        <CardHeader>
          <CardTitle>支付宝支付</CardTitle>
        </CardHeader>
        <CardContent>
          <BmInput label="app_id" fieldName={'system.pay_alipay_app_id'} formObject={form} />
          <BmInput label="app_secret_cert" fieldName={'system.pay_alipay_secret_cert'} formObject={form} />
          <BmRadioGroup
            label="是否开启"
            fieldName={'system.pay_alipay_open'}
            formObject={form}
            options={[
              { label: '开启', value: 1, id: 'open' },
              { label: '关闭', value: 0, id: 'close' }
            ]}
          />
        </CardContent>
      </Card>
      <Card>
        <CardHeader>
          <CardTitle>微信支付</CardTitle>
        </CardHeader>
        <CardContent>
          <BmInput label="mch_id" fieldName={'system.pay_wepay_mch_id'} formObject={form} />
          <BmInput label="mch_secret_cert" fieldName={'system.pay_wepay_secret_cert'} formObject={form} />
          <BmInput label="mp_app_id" fieldName={'system.pay_wepay_app_id'} formObject={form} />
          <BmRadioGroup
            label="是否开启"
            fieldName={'system.pay_wepay_open'}
            formObject={form}
            options={[
              { label: '开启', value: 1, id: 'open' },
              { label: '关闭', value: 0, id: 'close' }
            ]}
          />
        </CardContent>
      </Card>
    </main>
  )
}
